<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
    <link rel="shortcut icon" href="../resources/favicon.ico" th:href="@{/static/favicon.ico}"/>
    <!-- favicons Icons -->
    <link rel="apple-touch-icon" sizes="180x180" href="moban5146/assets/images/favicons/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="moban5146/assets/images/favicons/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="moban5146/assets/images/favicons/favicon-16x16.png">
    <link rel="manifest" href="moban5146/assets/images/favicons/site.webmanifest">
    <meta name="description" content="Pylon Loan HTML Template">

    <!-- fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
          rel="stylesheet">

    <link rel="stylesheet" href="moban5146/assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="moban5146/assets/css/fontawesome-all.min.css">
    <link rel="stylesheet" href="moban5146/assets/css/swiper.min.css">
    <link rel="stylesheet" href="moban5146/assets/css/animate.min.css">
    <link rel="stylesheet" href="moban5146/assets/css/pylon-icons.css">
    <link rel="stylesheet" href="moban5146/assets/css/odometer.min.css">
    <link rel="stylesheet" href="moban5146/assets/css/magnific-popup.css">
    <link rel="stylesheet" href="moban5146/assets/css/bootstrap-select.min.css">
    <link rel="stylesheet" href="moban5146/assets/css/nouislider.min.css">
    <link rel="stylesheet" href="moban5146/assets/css/nouislider.pips.css">

    <!-- template styles -->
    <link rel="stylesheet" href="moban5146/assets/css/main.css">
    <link rel="stylesheet" href="moban5146/assets/css/login.css">
</head>

<body>
<div class="preloader">
    <img class="preloader__image" src="moban5146/assets/images/loader.png" alt="">
</div><!-- /.preloader -->
<div class="page-wrapper">
    <header class="main-header">

        <nav class="main-menu">
            <div class="container">
                <div class="logo-box">
                    <a href="index.html" aria-label="logo image"><img src="moban5146/assets/images/logo-dark.png"
                                                                      width="155" alt=""></a>
                    <span class="fa fa-bars mobile-nav__toggler"></span>
                </div><!-- /.logo-box -->
            </div><!-- /.container -->
        </nav>
        <!-- /.main-menu -->
    </header><!-- /.main-header -->

    <div class="stricky-header stricked-menu main-menu">
        <div class="sticky-header__content"></div><!-- /.sticky-header__content -->
    </div><!-- /.stricky-header -->
    <!--	登录 start-->
    <div class="row login">
        <form id="login" action="/company/Login.do" method="post" style="margin: 5px auto;">
            <div class="login-font">
                <h5 style="font-weight: bold">用户登录</h5>
            </div>
            <div class="form-group">
                <label for="phonenumber" class="control-label">账号</label>
                <input type="tel" class="form-control" id="phonenumber" name="comPhone" placeholder="邮箱/手机号">
            </div>
            <div class="form-group">
                <label for="password" class="control-label">密码</label>
                <input type="password" class="form-control" id="password" name="comPwd" placeholder="密码">
                <p class="login-Message" id="prompt"></p>
            </div>
            <div class="form-group">
                <!-- begin:验证码 -->
                <label for="kaptcha" class="control-label">验证码</label>
                <input type="text" class="form-control" id="kaptcha" name="kaptcha"
                       placeholder="请输入验证码"/>
                <span class="login-Message" id="newMessage"><br></span>
                <img src="kaptcha.jpg" width="100" id="kaptchaImage" title="看不清，点击换一张"/>
                <small>看不清，点击换一张</small>
                <!-- end:验证码 -->
            </div>

            <div class="form-group">
                <div class="col-sm-offset-1">
                    <small>
                        <a href="register">忘记密码?</a>
                    </small>
                    <small class="login-reg">
                        <a href="reg">立即注册</a>
                    </small>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-1">
                    <button type="submit" id="user_insert_btn" class="btn btn-primary">&emsp;登&emsp;录&emsp;</button>
                </div>

            </div>
        </form>
    </div>
    <!--	登录 END-->
    <section class="main-slider">
        <div class="swiper-container thm-swiper__slider" data-swiper-options='{
        "slidesPerView": 1,
        "loop": true,
        "effect": "fade",
        "autoplay": {
            "delay": 5000
        },
        "navigation": {
            "nextEl": "#main-slider__swiper-button-next",
            "prevEl": "#main-slider__swiper-button-prev"
        }
    }'>
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <div class="image-layer"
                         style="background-image: url(moban5146/assets/images/main-slider/main-slider-1-1.jpg);"></div>
                    <!-- /.image-layer -->
                    <div class="container">
                        <div class="row">
                            <div class="col-xl-6 col-lg-6">
                                <p>先采购 & 后付款 & 放心享</p>
                                <h2>企业金采 采购无忧</h2>
                                <!-- /.thm-btn dynamic-radius -->
                            </div><!-- /.col-lg-7 text-right -->
                        </div><!-- /.row -->
                    </div><!-- /.container -->
                </div><!-- /.swiper-slide -->
                <div class="swiper-slide">
                    <div class="image-layer"
                         style="background-image: url(moban5146/assets/images/main-slider/main-slider-1-2.jpg);"></div>
                    <!-- /.image-layer -->
                    <div class="container">
                        <div class="row">
                            <div class="col-xl-6 col-lg-6">
                                <p>低门槛 & 期限长 / 低利率</p>
                                <h2>金宝贝一站式供应服务</h2>
                                <!-- /.thm-btn dynamic-radius -->
                            </div><!-- /.col-lg-7 text-right -->
                        </div><!-- /.row -->
                    </div><!-- /.container -->
                </div><!-- /.swiper-slide -->
                <div class="swiper-slide">
                    <div class="image-layer"
                         style="background-image: url(moban5146/assets/images/main-slider/main-slider-1-1.jpg);"></div>
                    <!-- /.image-layer -->
                    <div class="container">
                        <div class="row">
                            <div class="col-xl-6 col-lg-6">
                                <p>信用贷 & 订单贷 & 企业贷</p>
                                <h2>金小贷 不等“贷”</h2>
                                <!-- /.thm-btn dynamic-radius -->
                            </div><!-- /.col-lg-7 text-right -->
                        </div><!-- /.row -->
                    </div><!-- /.container -->
                </div><!-- /.swiper-slide -->
            </div><!-- /.swiper-wrapper -->

        </div><!-- /.swiper-container thm-swiper__slider -->
    </section><!-- /.main-slider -->


    <div class="bottom-footer">
        <div class="container">
            <p>Copyright &copy; 2020.Company name All rights reserved.
            </p>
            <div class="bottom-footer__social">
                <a href="#" class="fab fa-facebook-square"></a>
                <a href="#" class="fab fa-twitter"></a>
                <a href="#" class="fab fa-pinterest-p"></a>
                <a href="#" class="fab fa-instagram"></a>
            </div><!-- /.bottom-footer__social -->
        </div><!-- /.container -->
    </div><!-- /.bottom-footer -->

</div><!-- /.page-wrapper -->


<div class="mobile-nav__wrapper">
    <div class="mobile-nav__overlay mobile-nav__toggler"></div>
    <!-- /.mobile-nav__overlay -->
    <div class="mobile-nav__content">
        <span class="mobile-nav__close mobile-nav__toggler"><i class="far fa-times"></i></span>

        <div class="logo-box">
            <a href="index.html" aria-label="logo image"><img src="moban5146/assets/images/logo-light.png" width="155"
                                                              alt=""/></a>
        </div>
        <!-- /.logo-box -->
        <div class="mobile-nav__container"></div>
        <!-- /.mobile-nav__container -->

        <ul class="mobile-nav__contact list-unstyled">
            <li>
                <i class="pylon-icon-email1"></i>
                <a href="mailto:needhelp@azino.com">needhelp@pylon.com</a>
            </li>
            <li>
                <i class="pylon-icon-telephone"></i>
                <a href="tel:666-888-0000">666 888 0000</a>
            </li>
        </ul><!-- /.mobile-nav__contact -->
        <div class="mobile-nav__top">
            <div class="mobile-nav__language">
                <img src="moban5146/assets/images/resources/flag-1-1.jpg" alt="">
                <label class="sr-only" for="language-select">select language</label><!-- /#language-select.sr-only -->
                <select class="selectpicker" id="language-select">
                    <option value="english">English</option>
                    <option value="arabic">Arabic</option>
                </select>
            </div><!-- /.mobile-nav__language -->
            <div class="mobile-nav__social">
                <a href="#" aria-label="twitter"><i class="fab fa-twitter"></i></a>
                <a href="#" aria-label="facebook"><i class="fab fa-facebook-square"></i></a>
                <a href="#" aria-label="pinterest"><i class="fab fa-pinterest-p"></i></a>
                <a href="#" aria-label="instagram"><i class="fab fa-instagram"></i></a>
            </div><!-- /.mobile-nav__social -->
        </div><!-- /.mobile-nav__top -->


    </div>
    <!-- /.mobile-nav__content -->
</div>
<!-- /.mobile-nav__wrapper -->

<div class="search-popup">
    <div class="search-popup__overlay search-toggler"></div>
    <!-- /.search-popup__overlay -->
    <div class="search-popup__content">
        <form action="#">
            <label for="search" class="sr-only">search here</label><!-- /.sr-only -->
            <input type="text" id="search" placeholder="Search Here..."/>
            <button type="submit" aria-label="search submit" class="thm-btn">
                <i class="fa fa-search"></i>
            </button>
        </form>
    </div>
    <!-- /.search-popup__content -->
</div>
<!-- /.search-popup -->

<a href="#" data-target="html" class="scroll-to-target scroll-to-top"><i class="fa fa-angle-up"></i></a>


<script src="moban5146/assets/js/jquery-3.5.1.min.js"></script>
<script src="moban5146/assets/js/bootstrap.bundle.min.js"></script>
<script src="moban5146/assets/js/swiper.min.js"></script>
<script src="moban5146/assets/js/jquery.ajaxchimp.min.js"></script>
<script src="moban5146/assets/js/jquery.magnific-popup.min.js"></script>
<script src="moban5146/assets/js/jquery.validate.min.js"></script>
<script src="moban5146/assets/js/bootstrap-select.min.js"></script>
<script src="moban5146/assets/js/wow.js"></script>
<script src="moban5146/assets/js/odometer.min.js"></script>
<script src="moban5146/assets/js/jquery.appear.min.js"></script>
<script src="moban5146/assets/js/wNumb.min.js"></script>
<script src="moban5146/assets/js/nouislider.min.js"></script>

<!-- template js -->
<script src="moban5146/assets/js/theme.js"></script>

<script>
    if (window.top !== window.self) {
        window.top.location = window.location;
    }
    window.onload = function () {
        /*在gameid增加对检查按钮的验证*/
        var submitBtn = document.getElementById("user_insert_btn");
        submitBtn.onclick = function () {
            var kaptcha = $("#kaptcha").val();
            var phonenumber = $("#phonenumber").val();
            var password = $("#password").val();
            if (kaptcha.length == 0) {
                $("#newMessage").html("请输入验证码<br>");
                return false;
                // alert("请输入验证码！");
            }else if (phonenumber.length == 0){
                $("#newMessage").html("请输入用户名<br>");
                return false;
            }else if (password.length == 0){
                $("#newMessage").html("请输入密码<br>");
                return false;
            }else {
                $("#newMessage").html("<br>");
            }
        }
    }
    $(function(){
        //点击更换验证码
        // $("#kaptchaImage").prop("src", "/kaptcha.jpg?" + new Date().getTime());
        /*点击生成新的验证码*/
        $("#kaptchaImage").click(function () {
            $(this).prop("src", "/kaptcha.jpg?" + Math.floor(Math.random() * 100));
        });

        //验证账号是否激活
        $("#phonenumber").blur(function () {
            var formLogin = $("#phonenumber").val();
            $.ajax({
                type: "post",
                url: "company/loginTel",
                data: {tel:formLogin},
                datatype: "JSON",
                success: function (data) {
                    console.log(data);
                    if (data === "ok"){
                        $("#newMessage").html("账号未验证<br>");
                    }else {
                        $("#newMessage").html("<br>");
                    }
                },
                error: function (error) {
                    alert(error);
                }
            });
        });
    })
</script>
</body>
</html>